<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>后台管理</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.css">
    <link rel="stylesheet" href="../static/css/me.css">
    <link rel="stylesheet" href="../static/lib/editmd/css/editormd.css">
    <link rel="stylesheet" href="../static/lib/typo/typo.css">

</head>
<body>
<!-- 导航-->
<nav class="ui inverted attached segment m-padded-tb-mini m-container-shadow-small">
    <div class="ui container">
        <div class="ui inverted secondary stackable menu">
            <h2 class="ui blue header item">后台管理</h2>
            <a href="#" class="ui active item nav-item">
                <i class="ui home icon"></i>博客
            </a>
            <a href="#" class="ui item nav-item">
                <i class="ui idea icon"></i>分类
            </a>
            <a href="#" class="ui item nav-item">
                <i class="ui tags icon"></i>标签
            </a>
            <div class="right m-item m-mobile-hide menu">
                <div class="ui dropdown item">
                    <div class="text">
                        <div class="right m-item nav-item">
                            <img class="ui avatar image m-image" src="../static/images/detail.jpg">
                            豆芽菜
                        </div>
                    </div>
                    <i class="dropdown icon"></i>
                    <div class="menu">
                        <a href="#" class="ui center aligned item">注销</a>
                    </div>
                </div>
            </div>

        </div>
    </div>
</nav>

<!-- 二级 -->
<div class="ui attached menu pointing">
    <div class="ui container">
        <div class="right menu">
            <a href="#" class="blue active item">发布</a>
            <a href="#" class="item">列表</a>
        </div>
    </div>

</div>

<!-- 内容 -->
<div class="ui attached segment">
    <div class="ui container">

        <!-- content-header -->
        <form action="#" class="ui form" method="post">

            <!-- header-->
            <div class="ui field">
                <div class="ui left labeled input">
                    <div class="ui selection compact blue basic dropdown label">
                        <input type="hidden" value="原创" name="flag">
                        <i class="dropdown icon"></i>
                        <div class="text">原创</div>
                        <div class="menu">
                            <div class="item" data-value="原创">原创</div>
                            <div class="item" data-value="转载">转载</div>
                            <div class="item" data-value="翻译">翻译</div>
                        </div>
                    </div>
                    <input type="text" name="title" placeholder="title">
                </div>
            </div>

            <!-- content -->
            <div class="ui field">
                <div id="md-content" style="z-index: 1 !important;">
                    <textarea style="display: none !important;"></textarea>
                </div>
            </div>

            <!-- type & tags-->
            <div class="ui two fields m-margin-tb-large">
                <!-- type-->
                <div class="ui field">
                    <div class="ui left labeled input">
                        <label class="ui compact blue basic label">分类</label>
                        <div class="ui multiple search selection dropdown">
                            <input type="hidden" name="type">
                            <i class="ui dropdown icon"></i>
                            <div class="default text">type</div>
                            <div class="menu">
                                <div class="item" data-value="1">编程人生</div>
                                <div class="item" data-value="2">Java</div>
                                <div class="item" data-value="3">C++</div>
                                <div class="item" data-value="4">前端</div>
                                <div class="item" data-value="5">Vue</div>
                                <div class="item" data-value="6">React</div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- tags-->
                <div class="ui field">
                    <div class="ui left labeled input">
                        <label class="ui compact blue basic label">标签</label>
                        <div class="ui multiple search selection dropdown">
                            <input type="hidden" name="type">
                            <i class="ui dropdown icon"></i>
                            <div class="default text">tags</div>
                            <div class="menu">
                                <div class="item" data-value="1">编程人生</div>
                                <div class="item" data-value="2">Java</div>
                                <div class="item" data-value="3">C++</div>
                                <div class="item" data-value="4">前端</div>
                                <div class="item" data-value="5">Vue</div>
                                <div class="item" data-value="6">React</div>
                            </div>
                        </div>
                    </div>
                </div>


            </div>

            <!-- supplement  -->
            <div class="ui fields">
                <!-- 推荐-->
                <div class="ui filed m-margin-field-small">
                    <div class="ui toggle checkbox">
                        <input type="checkbox" tabindex="0" class="hidden" id="recommend" name="recommend">
                        <label for="recommend">推荐</label>
                    </div>
                </div>

                <!-- 转载声明-->
                <div class="ui field m-margin-filed-large">
                    <div class="ui toggle checkbox">
                        <input type="checkbox" tabindex="0" class="hidden" id="shareStatement"
                               name="shareStatement">
                        <label for="shareStatement">转载声明</label>
                    </div>
                </div>

                <!-- 赞赏-->
                <div class="ui field m-margin-filed-large">
                    <div class="ui toggle checkbox">
                        <input type="checkbox" tabindex="0" class="hidden" id="appreciate" name="appreciate">
                        <label for="appreciate">赞赏</label>
                    </div>
                </div>

                <!-- 评论-->
                <div class="ui field m-margin-filed-large">
                    <div class="ui toggle checkbox">
                        <input type="checkbox" tabindex="0" class="hidden" id="comment" name="comment">
                        <label for="comment">评论</label>
                    </div>
                </div>

            </div>

            <!-- buttonGroups-->
            <div class="ui right aligned container">
                <div class="ui animated button" tabindex="0" onclick="window.history.go(-1)">
                    <div class="visible content">
                        <i class="ui reply icon"></i>
                    </div>
                    <div class="hidden content">
                        返回
                    </div>
                </div>
                <div class="ui animated primary button" tabindex="0" onclick="window.history.go(-1)">
                    <div class="visible content">
                        <i class="ui save icon"></i>
                    </div>
                    <div class="hidden content">
                        保存
                    </div>
                </div>
                <div class="ui animated green button" tabindex="0" onclick="window.history.go(-1)">
                    <div class="visible content">
                        <i class="ui hand point up outline icon"></i>
                    </div>
                    <div class="hidden content">
                        发布
                    </div>
                </div>
            </div>

        </form>
    </div>
</div>

</body>
</html>
<script src="../static/js/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>
<script src="../static/lib/editmd/editormd.js"></script>
<script type="text/javascript">
    $('.ui.dropdown').dropdown({
        on: 'click'
    });

    // 初始化editmd
    var testEditor;

    $(function () {
        testEditor = editormd("md-content", {
            width: "100%",
            height: 640,
            syncScrolling: "single",
            path: "../static/lib/editmd/lib/"
        });
    });
</script>